import React, { Component } from 'react';
import {
    Flex,
    Icon,
    Modal,
    Carousel,
    WingBlank,
    WhiteSpace,
    ImagePicker,
    Toast,
    Popover,
    List,
    Grid
} from 'antd-mobile';
import { findDetail} from './findDetail.less';
import { connect } from 'dva';
import picture1 from '../../assets/svg/picture1.svg';
import NavTopBar from '../../components/NavTopBar/NavTopBar';
import NoLazyImg from '../../components/NoLazyImg/NoLazyImg';
import MyScroll from '../../components/MyScroll/MyScroll';
import MyListView from '../../components/MyListView/MyListView';
import dianzan from '../../assets/svg/dianzan.svg';
import dianzan1 from '../../assets/svg/dianzan1.svg';
import lajitong from '../../assets/svg/lajitong.svg';
import btn1 from '../../assets/svg/btn1.svg';
import btn2 from '../../assets/svg/btn2.svg';
import back from '../../assets/svg/back.svg';
import news from '../../assets/svg/news.svg';
//import smile from '../../assets/svg/smile.svg';
import dili from '../../assets/svg/dili.svg';
import { IMAGE_DOMAIN,isWechat,GetQueryString } from '../../utils/common';
import share from '../../assets/svg/share.svg';
import share_1 from '../../assets/svg/share_1.svg';
import share_2 from '../../assets/svg/share_2.svg';
import {routerRedux} from "dva/router";
import {noguanzhu, share_madel, tishi,evalute_madel} from "./findIndex.less";
import {wxShare} from "../../utils/weixinShare";
import {getIsFalse} from "../../utils/judgmentEquipment";

class FindDetail extends Component {
    constructor(props) {
        super(props);
        this.state = {
            hideMask:false,
            Visible:false,
            isShare: false,
            modal:false,
            num:0,
            aca:true,
            files:[],
        };
        this.AlloyTouch=null;
        this.timeout="";;
        this.imgURL=[];
    }
    show  = (i) =>{
        this.setState({
            Visible:true,
            num:i
        })
    }
    showModal = (e) => {
        this.setState({
            modal: true,
        });
    };
    onClose = () => {
        this.setState({
            modal: false,
        });
    };
    OnChange = (files, type, index) => {
        this.setState({
            files,
        });
        if(files.length>1) {Toast.info("最多上传一张回复图片!");return false}
        if (type == "add") this.props.dispatch({type: "orderList/upLoadEFF", obj:{upfile: files[files.length - 1].file}}).then(res => {if(res.code==200)this.imgURL.push(res.ret.url);this.setState({aca:false});console.log(this.imgURL)})
        else if ( type == "remove") {this.imgURL.splice(index, 1);this.setState({aca:true})}
    }
    componentDidMount(){
        this.props.dispatch({ type: 'findOthers/findDetailsEFF', obj:{ id:this.props.match.params.data}}).then(result=>{
            if(result.code==200&&isWechat()){
                console.log(result)
                wxShare(location.href,result.ret.trendsDetailEntity.sharePictures);
            }
        });
        this.props.dispatch({ type: 'findOthers/findCommentListEFF', obj:{ id:this.props.match.params.data,pageNo:1 }}).then(result=>{
            if(result.code==200){
                //console.log(result.ret.trendsCommentEntities)
                if(this.props.match.params.scroll==1){
                    this.AlloyTouch && this.AlloyTouch.to(-document.getElementById("pingLun").offsetTop)
                }
                //this.props.dispatch({ type: 'findOthers/save', data: { trendsCommentEntities: result.ret.trendsCommentEntities}})
                //console.log(this.props.trendsCommentEntities)
            }else{

            }
        });

        console.log(document.getElementById("pingLun").offsetTop,document.getElementById("pingLun").scrollTop);
    }
    onChange = (e) => {
        this.setState({
            value: e.target.value
        });
    };
    gofocus = () =>{
        console.log('关注')
        this.props.dispatch({type:"findOthers/connerFollowEFF",obj:{connerId:this.props.match.params.data }}).then(result=>{
            if(result.code==200){
                Toast.success(result.msg,1.5,()=>{
                    this.props.dispatch({ type: 'findOthers/findDetailsEFF', obj:{ id:this.props.match.params.data}})
                })
            }
        })
    };
    submitComment=()=>{
        console.log('提交评论')
        this.props.dispatch({type:"findOthers/submitSommentEFF",obj:{id:this.state.id ,content:this.state.value,pictures:this.imgURL.join(",") }}).then(result=>{
            this.setState({hideMask: false})
            if(result.code==200){
                Toast.success(result.msg,1.5,()=>{
                    this.setState({value:""});
                    this.imgURL = [];
                    this.refresh();
                    this.AlloyTouch && this.AlloyTouch.to(0);
                    //this.props.dispatch({type:"findOthers/findCommentListEFF",obj:{id:this.props.match.params.data}});
                })
            }else{

            }
        })
    }

    refresh = () => {
        console.log('refresh')
        return this.props.dispatch({type:"findOthers/findCommentListEFF",obj:{id:this.props.match.params.data,pageNo:1}});
    }
    like=(e)=>{
        console.log('详情点赞')
        this.props.dispatch({type:"findOthers/connerLikeEFF",obj:{id:this.props.match.params.data  }}).then(result=>{
            if(result.code==200){
                Toast.success(result.msg,1.5,()=>{
                    this.props.dispatch({ type: 'findOthers/findDetailsEFF', obj:{ id:this.props.match.params.data}})
                })
            }
        })
    }
    likeComment=(id)=>{
        console.log('评论点赞')
        this.props.dispatch({type:"findOthers/commentLikeEFF",obj:{trendsId:this.props.match.params.data,id :id  }}).then(result=>{
            if(result.code==200){
                Toast.success(result.msg,1.5,()=>{
                    this.refresh();
                    //this.props.dispatch({type:"findOthers/findCommentListEFF",obj:{id:this.props.match.params.data}});
                })
            }
        })
    }
    getAlloyTouch = (AT) =>{
        this.AlloyTouch = AT;
    }
    formatNumber = n => {
        n = n.toString()
        return n[1] ? n : '0' + n
    };
    formatTimes = oDate => {
        const date=new Date(parseInt(oDate))
        const year = date.getFullYear()
        const month = date.getMonth() + 1
        const day = date.getDate()
        const hour = date.getHours()
        const minute = date.getMinutes()
        const second = date.getSeconds();
        const newDate=new Date();
        if (date < newDate.getTime() - 7 * 24 * 3600 * 1000) {
            return [year, month, day].map(this.formatNumber).join('-') + ' ' + [hour, minute].map(this.formatNumber).join(':') } else if (date < newDate.getTime() - 24 * 3600 * 1000) {
            return newDate.getDate() - day > 0 ? newDate.getDate() - day + '天前' : getCountDays(date) - Math.abs(newDate.getDate() - day) + '天前'
        } else if (date < newDate.getTime() - 3600 * 1000) {
            return newDate.getHours() - hour > 0 ? newDate.getHours() - hour + '小时前' : 24 - Math.abs(newDate.getHours() - hour) + '小时前'
        } else if (date < newDate.getTime() - 60 * 1000) {
            return newDate.getMinutes() - minute > 0 ? newDate.getMinutes() - minute + '分钟前' : 60 - Math.abs(newDate.getMinutes() - minute) + '分钟前'
        }else{
            return '刚刚'
        }
    }
    decodeUnicode=(str)=> {
        str = str.replace(/\\/g, "%");
        return unescape(str);
    }
    header = () =>{
        const findDetailData=this.props.findOthers.trendsDetailEntity;
        const { pictures="" , createTime }=findDetailData;
        const picturesList=pictures.split(',');
        let { Visible, num } = this.state;

        return <div>
            {
                findDetailData.trendsType=='article' ?   <WingBlank className="content">
                    <Flex>
                        <div className="title">{findDetailData.articleTitle || "我是标题，现在这个字段是空"}</div>
                    </Flex>
                    <Flex justify="between">
                        <Flex>
                            <span  className='user_avator' >
                                 <NoLazyImg src={findDetailData.head==undefined?"../../assets/img/imgError.jpg":findDetailData.head} style={{width:'100%',height:'100%',borderRadius:"100%"}} alt=""/>
                            </span>
                            <div className="user_msg">
                                <span>{ findDetailData.memberName }</span>
                                <span>{ this.formatTimes(createTime) }</span>
                            </div>
                        </Flex>
                        {
                            findDetailData.isMe==0? findDetailData.isConner==0 ? <div onClick={this.gofocus} className="user_focus">关注</div>:<div onClick={this.gofocus} className="user_focus">已关注</div>:""
                        }

                    </Flex>
                    <Flex>
                        <div className="article">{JSON.parse(findDetailData.articleContent).map((a,b)=>{
                            if(a.type=="str"){
                                return <div key={b} style={{marginBottom:".1rem"}}>
                                    {a.content}
                                </div>
                            }else if(a.type=="img"){
                                return <NoLazyImg src={a.content} key={b} style={{marginBottom:".1rem"}}></NoLazyImg>
                            }else if(a.type=="goods"){
                                return a.content.map((k,o)=>{
                                    return  <Flex key={o} style={{height: "2.15rem",width: "100%",background:"#F7F7F7",padding:'0 .2rem',boxSizing: "border-box",marginBottom:".2rem"}} onClick={()=>{this.props.dispatch(routerRedux.push({pathname: `/goodsDetail/${k.specId}`}))}}>
                                        <Flex direction="row" style={{marginBottom:'0rem'}}>
                                            <div style={{width:'1.6rem',height:'1.6rem'}}>
                                                <NoLazyImg src={k.goodsImg?k.goodsImg:""} style={{width:'1.6rem',height:'1.6rem'}} alt=""/>
                                            </div>
                                            <div className="good_msg">
                                                <div>{k.goodsName}</div>
                                                <div>¥{k.goodsStorePrice}</div>
                                            </div>
                                        </Flex>
                                    </Flex>
                                })
                            }

                        })}</div>
                    </Flex>
                        {findDetailData.location ? <Flex style={{marginTop:".2rem"}}>
                            <Icon type={dili.id} style={{marginRight:".2rem",color:"#539ad8"}}></Icon>
                            <div>{findDetailData.location }</div>
                        </Flex>:""}

                    <Flex justify="center" style={{marginTop:".2rem"}}>
                        {findDetailData.isPoint ==0? <Flex justify="center" className="like_num" style={{border:"1px solid #999"}}>
                            <Icon type={dianzan.id} onClick={this.like}/>
                            <span style={{color:"#999"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                        </Flex>:<Flex justify="center" className="like_num">
                            <Icon type={dianzan1.id} onClick={this.like}/>
                            <span style={{color:"#ff0036"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                        </Flex>}

                    </Flex>
                </WingBlank>
                    : findDetailData.trendsType=='video' ?  <WingBlank className="content">
                        <Flex justify="between">
                            <Flex>
                                <span  className='user_avator' >
                                     <NoLazyImg src={findDetailData.head==undefined?"../../assets/img/imgError.jpg":findDetailData.head} style={{width:'100%',height:'100%',borderRadius:"100%"}} alt=""/>
                                </span>
                                <div className="user_msg">
                                    <span>{ findDetailData.memberName }</span>
                                    <span>{ this.formatTimes(createTime) }</span>
                                </div>
                            </Flex>
                            {
                                findDetailData.isMe==0? findDetailData.isConner==0 ? <div onClick={this.gofocus} className="user_focus">关注</div>:<div onClick={this.gofocus} className="user_focus">已关注</div>:""
                            }

                        </Flex>
                        <Flex wrap="wrap">
                            {findDetailData.topicName!=""&&findDetailData.topicName.split(",").map((va,ia)=>{
                                return <div style={{color:"#ff0036",marginRight:".1rem"}} key={ia}>
                                                #{this.decodeUnicode(va)}#
                                            </div>
                            }) }
                            <div className="article">{findDetailData.content}</div>
                        </Flex>
                        <Flex style={{height:"4rem"}}>
                            <video src={IMAGE_DOMAIN+findDetailData.videos} controls width="100%" height="100%"/>
                        </Flex>
                        {findDetailData.location ? <Flex style={{marginTop:".2rem"}}>
                            <Icon type={dili.id} style={{marginRight:".2rem",color:"#539ad8"}}></Icon>
                            <div>{findDetailData.location }</div>
                        </Flex>:""}
                        <Flex justify="center" style={{marginTop:".2rem"}}>
                            {findDetailData.isPoint ==0? <Flex justify="center" className="like_num" style={{border:"1px solid #999"}}>
                                <Icon type={dianzan.id} onClick={this.like}/>
                                <span style={{color:"#999"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                            </Flex>:<Flex justify="center" className="like_num">
                                <Icon type={dianzan1.id} onClick={this.like}/>
                                <span style={{color:"#ff0036"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                            </Flex>}
                        </Flex>

                </WingBlank>
                    :   <WingBlank className="content">
                    <Flex justify="between">
                        <Flex>
                                <span  className='user_avator' >
                                     <NoLazyImg src={findDetailData.head==undefined?"../../assets/img/imgError.jpg":findDetailData.head} style={{width:'100%',height:'100%',borderRadius:"100%"}} alt=""/>
                                </span>
                            <div className="user_msg">
                                <span>{ findDetailData.memberName }</span>
                                <span>{ this.formatTimes(createTime) }</span>
                            </div>
                        </Flex>
                        {
                            findDetailData.isMe==0? findDetailData.isConner==0 ? <div onClick={this.gofocus} className="user_focus">关注</div>:<div onClick={this.gofocus} className="user_focus">已关注</div>:""
                        }
                    </Flex>
                        {findDetailData.topicName? <Flex  wrap="wrap">
                            {findDetailData.topicName.split(",").map((va,ia)=>{
                                return <div style={{color:"#ff0036",marginRight:".1rem"}} onClick={(e)=>{
                                    e.stopPropagation();
                                    this.props.dispatch(routerRedux.push({
                                        pathname:`/topicPage/${this.decodeUnicode(ia)}`
                                    }))
                                }} key={ia}>
                                                #{this.decodeUnicode(va)}#
                                            </div>
                            }) }
                            <div className="article">{findDetailData.content}</div>
                        </Flex>:<div className="article">{findDetailData.content}</div>}

                        {findDetailData.pictures==""?"":picturesList.length==1?picturesList.map((vv,ii)=>{
                            console.log(vv)
                            return <NoLazyImg src={vv} key={ii} onClick={ ()=>{ this.show(ii) } } style={{width:"100%"}}/>

                        }):  <Flex wrap="wrap">{picturesList.map((vv,ii)=>{
                            return <div key={ii} style={{width:"33%",textAlign:"center"}}>
                                <NoLazyImg src={vv!=undefined?vv:""} onClick={ ()=>{ this.show(ii) } }  style={{width:"2.5rem",height:"2.5rem"}}/>
                            </div>
                        })}</Flex>}
                    {/*{findDetailData.pictures==""?"": picturesList.length==1 ?*/}
                        {/*<Grid data={picturesList}*/}
                              {/*itemStyle={{height: "2.28rem"}}*/}
                              {/*activeStyle={false}*/}
                              {/*columnNum={1}*/}
                              {/*renderItem={(va,ia) => (*/}
                              {/*<NoLazyImg onClick={ ()=>{ this.show(ia) } } src={va==undefined?"../../assets/img/imgError.jpg":va} style={{height: "2.28rem",boxSizing:'border-box'}} alt=""/>*/}
                            {/*)}*/}
                        {/*/>*/}
                        {/*: picturesList.length==2 || picturesList.length==4 ?*/}
                        {/*<Grid data={picturesList}*/}
                              {/*itemStyle={{height: "3.4rem"}}*/}
                              {/*activeStyle={false}*/}
                              {/*columnNum={2}*/}
                              {/*renderItem={(va,ia) => (*/}
                              {/*<NoLazyImg onClick={ ()=>{ this.show(ia) } } src={va==undefined?"../../assets/img/imgError.jpg":va} style={{height:'3.4rem',marginTop:".2rem",marginLeft:".16rem",boxSizing:'border-box'}}  alt=""/>*/}
                            {/*)}*/}
                        {/*/> :*/}
                        {/*<Grid data={picturesList}*/}
                              {/*itemStyle={{height: "2.28rem"}}*/}
                              {/*activeStyle={false}*/}
                              {/*columnNum={3}*/}
                              {/*renderItem={(va,ia) => (*/}
                              {/*<NoLazyImg onClick={ ()=>{ this.show(ia) } } src={va==undefined?"../../assets/img/imgError.jpg":va} style={{height: "2.28rem",boxSizing:'border-box'}} alt=""/>*/}
                            {/*)}*/}
                        {/*/>*/}
                    {/*}*/}
                        <Modal
                            popup
                            visible={this.state.modal}
                            onClose={this.onClose}
                            // animationType="slide-down"
                            className={tishi}
                            maskClosable={true}
                            transparent={true}
                        >
                            <Flex justify="end" style={{width:"100%"}}>
                                <Icon type={btn2.id} style={{width:"4rem",height:"3rem",position:"relative",bottom:".5rem"}}></Icon>
                            </Flex>
                            <Flex justify="center" style={{width:"100%",marginTop:"3.5rem"}}>
                                <Icon type={btn1.id} style={{width:"3rem",height:"3rem"}} onClick={this.onClose}></Icon>
                            </Flex>
                        </Modal>
                    <Modal
                        visible={Visible}
                        transparent
                        maskClosable={false}
                        className={evalute_madel}
                        //onClose={this.onClose('modal1')}
                        //title="Title"
                        // footer={[{ text: 'Ok', onPress: () => { console.log('ok'); this.onClose('modal1')(); } }]}
                        // wrapProps={{ onTouchStart: this.onWrapTouchStart }}
                    >
                        <div style={{ height:"100%" }}>
                            <Flex className="title" justify="between">
                                <div
                                    onClick={()=>{ this.setState({
                                        Visible:false
                                    }) }}
                                    style={{width:"33%"}}
                                >
                                    <Icon type="left" style={{width:".44rem",height:".44rem"}}/>
                                </div>
                                <div style={{width:"33%",textAlign:"center",}}>
                                    {num+1}/{picturesList.length}
                                </div>
                                <div style={{width:"33%"}}></div>
                            </Flex>

                            <Flex className="ev_carousel">
                                <Carousel
                                    //key={this.state.num}
                                    //  className={index_banner}
                                    selectedIndex={num}
                                    //autoplay={data.length != 1}
                                    autoplay={false}
                                    afterChange={(n)=>{
                                    this.setState({
                                        num:n
                                    })
                                }}
                                    infinite
                                    dots={false}
                                    // resetAutoplay={true}
                                >
                                    {
                                        picturesList.map((item, index) => (
                                            <div key={index} style={{height:"auto",textAlign:"center"}}>
                                                <NoLazyImg
                                                    onLoad={
                                                    ()=>{
                                                        window.dispatchEvent(new Event('resize'));
                                                    }
                                                }
                                                    onClick={()=>{ this.setState({
                                                    Visible:false
                                                }) }}
                                                    style={{ width:"60%", height:"100%" }}
                                                    src={item}
                                                />
                                            </div>
                                        ))
                                    }
                                </Carousel>
                            </Flex>
                        </div>

                    </Modal>
                        {findDetailData.location ? <Flex style={{marginTop:".2rem"}}>
                            <Icon type={dili.id} style={{marginRight:".2rem",color:"#539ad8"}}></Icon>
                            <div>{findDetailData.location }</div>
                        </Flex>:""}
                    <Flex justify="center" style={{marginTop:".2rem"}}>
                        {findDetailData.isPoint ==0? <Flex justify="center" className="like_num" style={{border:"1px solid #999"}}>
                            <Icon type={dianzan.id} onClick={this.like}/>
                            <span style={{color:"#999"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                        </Flex>:<Flex justify="center" className="like_num">
                            <Icon type={dianzan1.id} onClick={this.like}/>
                            <span style={{color:"#ff0036"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                        </Flex>}
                    </Flex>
                </WingBlank>
            }
            <div style={{width:"100%",height: ".22rem",background:"#f7f7f7"}}></div>
            <div style={{borderLeft:'.05rem solid #FF0036',paddingLeft:".1rem",margin:".2rem"}} id="pingLun">评论</div>
        </div>

    }
    commentList = (v,i)=>{
        console.log(v.praise)
        return <div style={{marginBottom:".36rem"}}>
            <Flex justify="between" style={{marginBottom:"0"}}>
                <Flex>
                            <span className='user_avator' >
                                 <NoLazyImg src={v.memberImage==undefined?"../../assets/img/imgError.jpg":v.memberImage} style={{width:'100%',height:'100%',borderRadius:"100%"}} alt=""/>
                            </span>
                    <div className="user_msg_c">
                        <span>{v.memberName}</span>
                    </div>
                </Flex>

                {v.isPoint ==0? <Flex onClick={()=>{this.likeComment(v.commentsId)}} style={{margin:"0rem",padding:'0rem',marginLeft:"-.1rem",width:"1rem"}}>
                    <Icon type={dianzan.id} style={{width:".37rem",height: ".37rem"}} />
                    <span style={{color:"#999",fontSize: ".24rem",paddingTop: ".05rem"}}>{v.praise|| <span >点赞</span>}</span>
                </Flex>:<Flex onClick={()=>{this.likeComment(v.commentsId)}} style={{margin:"0rem",padding:'0rem',marginLeft:"-.1rem",width:"1rem"}}>
                    <Icon type={dianzan1.id}/>
                    <span style={{color:"#ff0036",fontSize: ".24rem",paddingTop: ".05rem"}}>{v.praise|| <span >点赞</span>}</span>
                </Flex>}
            </Flex>
            <Flex direction="column">
                <div className="comment">{v.comments}</div>
                {v.picture? <div style={{width:"100%",marginBottom:".2rem"}}>
                    <NoLazyImg src={v.picture}></NoLazyImg>
                </div>:""}
                <Flex justify="between" style={{width:"100%"}}>
                    <div className="time"  onClick={() => {
                        this.setState({
                            hideMask: true,
                            files:[],
                            replyUser:"回复："+v.memberName,
                            id:v.commentsId
                        })
                    }}>
                        { this.formatTimes(v.createTime)}　·　{v.reseveComments==0?'':v.reseveComments} 回复
                    </div>
                    {v.isMe==1? <Icon type={lajitong.id} style={{color:"#999",width:".37rem",height: ".37rem"}} onClick={()=>{
                        Modal.alert("", <div style={{ lineHeight: '0.9rem', fontSize: "0.3rem",padding:".5rem",color:"#333" }}>删除该评论!</div>, [ {
                            text: '取消',
                            onPress: () => {
                            },
                        },{
                            text: '确定',
                            onPress: () => {
                                this.props.dispatch({type:"findOthers/delSommentEFF",obj:{commentId:v.commentsId ,releaseId:v.memberId}}).then(result=>{
                                    if(result.code==200){
                                        Toast.success(result.msg,2,()=>{
                                            this.refresh();
                                        })
                                    }
                                })
                            },
                        }]);

                    }}/>:""}

                </Flex>

                {
                    v.trendsSecondCommentEntity.length!=0 &&
                    <div className="commentPay">
                        {
                            (v.trendsSecondCommentEntity || []).map((va,i)=> {
                                return <Flex align="start" key={i}>
                                    <div>{va.memberName} 回复 {va.commentMenmberName} ：</div>
                                    <div>
                                        <div>{va.comments}</div>
                                        {va.pictures? <div style={{width:"2rem",margin:".1rem 0",height:"2rem"}}>
                                            <NoLazyImg src={va.pictures} style={{width:"100%",height:"100%"}}></NoLazyImg>
                                        </div>:""}
                                    </div>
                                </Flex>
                            })
                        }
                        {
                            v.trendsSecondCommentEntity.length>=3 && !v.isShowMore &&
                            <div onClick={()=>{
                                console.log('查看全部回复')
                                this.props.dispatch({type:"findOthers/commentDetailEFF",obj:{id:v.commentsId,trendsId:this.props.match.params.data,pageNo:v.trendsSecondCommentEntityPageNo || 1}});
                            }} style={{color:"#47B3F9",fontSize:".22rem"}}>查看全部回复 ></div>
                        }
                    </div>
                }

            </Flex>
        </div>
    }
    loadMore =() => {
        console.warn('上拉加载下一页', this.props.findOthers.commentListPageNo)
        return this.props.dispatch({type:"findOthers/findCommentListEFF",obj:{id:this.props.match.params.data,pageNo:(this.props.findOthers.commentListPageNo || 1) +1}});

    }

    render() {
        let { Visible, num,files ,isShare,aca} = this.state;

        const findDetailData=this.props.findOthers.trendsDetailEntity;
        console.log(this.props)
        const commentList=this.props.findOthers.commentList || [];
        const { app } = this.props;
        let { targetScrollHeight,scrollValue } = app;
        console.log(scrollValue,targetScrollHeight)
        const { createTime }=findDetailData;
        return (
            <div className={findDetail}>
                <NavTopBar dispatch={this.props.dispatch} title='发现详情'></NavTopBar>
                <WingBlank style={{paddingTop:".1rem"}}>
                    {
                        commentList.length==0 ?
                            <MyScroll getAlloyTouch={ this.getAlloyTouch } style={{marginBottom:".36rem",position:"absolute",top:"1rem",bottom:".8rem",left:"0rem"}}>
                                {this.header()}
                                <div className={noguanzhu}>
                                    <div className="pinglunLogo"></div>
                                    <div >快来回复抢沙发!</div>
                                </div>
                            </MyScroll>
                            :
                            <MyListView
                                style={{marginBottom:".36rem",position:"absolute",top:"1rem",bottom:".8rem",left:"0rem"}}
                                getAlloyTouch={ this.getAlloyTouch }
                                refresh={ this.refresh }
                                loadMore={ this.loadMore }
                                hasMore={ commentList.length >=10 }
                                renderItem={(v,i,a)=>{
                                return (
                                    i==0 ? <div key={v.commentsId}> {this.header()}
                                        <div style={{padding:" 0 .4rem"}}>{this.commentList(v,i)}</div>
                                    </div>
                                    : <div style={{padding:" 0 .4rem"}} key={v.commentsId}>{this.commentList(v,i)}</div>
                                        )
                                    }}
                                data={ commentList }>
                            </MyListView>
                    }
                </WingBlank>

                {
                    targetScrollHeight < 0 ?  <div onClick={()=>{ this.AlloyTouch.to(0); }} className="go_top"></div> : ''
                }
                {
                /**
                 * <Flex className="evaBottom">
                 <Flex className="search_input">
                 <input placeholder="请输入评论" id="huifu" type="text" onChange={this.onChange} />
                 <Icon style={{position:"absolute",top:".15rem",right:".16rem",width:".37rem",height: ".37rem"}} type={smile.id} onClick={this.like}/>
                 </Flex>
                 <Flex align="end" style={{margin:"0rem",padding:'0rem',marginLeft:"-.1rem"}}>
                 <Icon style={{width:".37rem",height: ".37rem"}} type={news.id}/>
                 <span style={{color:"#999",fontSize: ".18rem"}}>{88}</span>
                 </Flex>
                 <Icon onClick={this.submitComment} style={{color:"#1c1c1c",width:".37rem",height: ".37rem",marginLeft:".2rem"}} type={share.id}/>

                 </Flex>
                 */
                }

                <Flex justify="around" className="evaBottom">
                    <Flex style={{margin:"0rem",padding:'0rem'}} onClick={() => {
                         this.setState({
                            hideMask: true,
                             files:[],
                            replyUser:"说说您的看法......",
                            id:this.props.match.params.data
                         })
                     }}>
                        <Icon style={{width:".37rem",height: ".37rem"}} type={news.id}/>
                        <span style={{color:"#999",marginLeft: ".2rem"}}>{false ? 88 : '评论'}</span>
                    </Flex>
                    {findDetailData.isPoint ==0? <Flex style={{margin:"0rem",padding:'0rem'}} onClick={this.like}>
                        <Icon style={{width:".4rem",height: ".4rem"}} type={dianzan.id}/>
                        <span style={{color:"#666",marginLeft: ".2rem"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                    </Flex>:<Flex style={{margin:"0rem",padding:'0rem'}}>
                        <Icon type={dianzan1.id} style={{width:".4rem",height: ".4rem"}} onClick={this.like}/>
                        <span style={{color:"#ff0036",marginLeft: ".2rem"}}>{+findDetailData.point  || <span >点赞</span> }</span>
                    </Flex>}
                    {isWechat()? <Flex style={{margin:"0rem",padding:'0rem'}}>
                        <Icon type={share.id} onClick={()=>{
                            this.showModal();
                        }}/>
                        <span style={{marginLeft: ".2rem"}}>分享</span>
                    </Flex>:""}
                </Flex>
                <Modal
                    popup
                    visible={isShare}
                    animationType="slide-up"
                    maskClosable={true}
                    className={share_madel}
                    onClose={() => { this.setState({ isShare: false }); }}
                >
                    <Flex justify="between" className="share_icon">
                        <Icon type={share_1.id} style={{color:"#999",width:"1.2rem",height:"1.2rem"}} onClick={()=>{

                            wxShare(findDetailData.shareAddress,findDetailData.sharePictures);
                        }}/>
                        <Icon type={share_2.id} style={{ color:"#999",width:"1.2rem",height:"1.2rem"}} onClick={()=>{
                            wxShare(findDetailData.shareAddress,findDetailData.sharePictures);
                        }}/>
                    </Flex>
                    <div className="btn" onClick={() => {
                        this.setState({ isShare: false })
                    }}>取消</div>
                </Modal>
                {
                    findDetailData.trendsType=='article'&&
                    targetScrollHeight < -100 &&
                    <Flex className="navTop">
                        <Flex justify="center" onClick={()=>{
                                this.props.dispatch(routerRedux.goBack());
                            }}>
                            <Icon type={back.id} />
                        </Flex>
                        <Flex align="center" justify="center" style={{marginLeft:".3rem",width:"70%"}}>
                            <span  className='user_avator' >
                                 <NoLazyImg src={findDetailData.head==undefined?"../../assets/img/imgError.jpg":findDetailData.head} style={{width:'100%',height:'100%',borderRadius:"100%"}} alt=""/>
                            </span>
                            <div style={{marginLeft:".2rem"}}>
                                <span>{ findDetailData.memberName }</span>
                            </div>
                        </Flex>
                        {
                            findDetailData.isMe==0? findDetailData.isConner==0 ? <div onClick={this.gofocus} className="auser_focus">+关注</div>:<div onClick={this.gofocus} className="user_focus">已关注</div>:""
                        }

                    </Flex>
                }
                {
                    this.state.hideMask &&
                    <div className="maskInputBox">
                        <div className="mask" onClick={() => this.setState({hideMask: false})}></div>
                        <Flex justify="around" className="inputBox">
                            <div style={{border:"1px solid #e5e5e5"}}>
                                 <textarea id="huifu" onChange={this.onChange} onFocus={(e)=>{
                                     this.timeout = setTimeout(function(){
                                         e.target.scrollIntoView(true);
                                         console.log('scrollIntoViewIfNeeded');
                                     },300);
                                 }} onBlur={()=>{
                                     clearTimeout(this.timeout);
                                 }} placeholder={this.state.replyUser}/>
                                <div id="Picker" style={aca?{visibility:"hidden"}:{}}>
                                    <ImagePicker
                                        files={files}
                                        ref="imgClick"
                                        length="1"
                                        onChange={this.OnChange}
                                        selectable={files.length < 1}
                                    />
                                </div>

                            </div>
                            <div>
                                <div style={{position:"relative",marginBottom:".2rem",textAlign:"center"}} onClick={()=>{
                                    if(this.imgURL.length>1) Toast.fail("回复图片最多一张!",2);
                                    else {document.querySelector("#Picker input[type=file]").setAttribute("id","picture");}
                                }}>
                                    <label htmlFor="picture" ref="picture" style={{opacity:"0",display:"block",width:"100%",height:"100%",position:"absolute",top:"0",left:"0"}}></label>
                                    <Icon type={picture1.id}  />
                                </div>

                                <div onClick={this.submitComment} >发表</div>
                            </div>

                        </Flex>
                    </div>
                }


            </div>
        );
    }
}
export default connect(({ app , findOthers,orderList }) => ({ app , findOthers,orderList}))(FindDetail);
